<!--
 * Description: FD 基本数据修改组件
 * Company: 联宝（合肥）电子科技有限公司
 * Author: Qiuxue.Wu
 * Date: 2020/06/10 16:11
-->

<template>
  <div>
    <!--数据表单-->
    <el-form label-position="left" label-width="140px" :model="formData" size="mini">
      <!-- ---------------FD基本信息START------------------ -->
      <el-row>
        <el-col :span="24">
          <el-form-item
            :label="$t('FD.fdBaseInfo')"
            label-width="160px"
            style="background: #c9d2ca; padding-left: 20px"
          />
        </el-col>
      </el-row>
      <el-row style="padding-left: 20px">
        <!--FD编号-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.fdId')">
            <el-input v-model="formData.fdId" v-blur:fdId="formData" clearable disabled />
          </el-form-item>
        </el-col>

        <!--FD版本-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.version')">
            <el-input v-model="formData.version" v-blur:version="formData" clearable disabled />
          </el-form-item>
        </el-col>

        <!--FD报价期限-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.expiresDay')">
            <el-input-number
              v-model="formData.expiresDay"
              clearable
              controls-position="right"
              :min="0"
            />
          </el-form-item>
        </el-col>

        <!--bu类型-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.bu')">
            <el-select v-model="formData.bu" clearable :placeholder="$t('select.placeholder')">
              <el-option
                v-for="item in $store.getters['enums/getBuList']"
                :key="item"
                :label="item"
                :value="item"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--FD名称-->
        <el-col :span="12">
          <el-form-item :label="$t('FdData.fdName')">
            <el-input
              v-model="formData.fdName"
              v-blur:fdName="formData"
              clearable
              style="width: 95% !important"
            />
          </el-form-item>
        </el-col>

        <!--平台-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.platform')">
            <el-input v-model="formData.platform" v-blur:platform="formData" clearable />
          </el-form-item>
        </el-col>

        <!--尺寸-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.lcd')">
            <el-input v-model="formData.lcd" v-blur:lcd="formData" clearable />
          </el-form-item>
        </el-col>

        <!--产量-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.volume')">
            <el-input-number
              v-model="formData.volume"
              clearable
              controls-position="right"
              :precision="0"
            />
          </el-form-item>
        </el-col>

        <!--推向市场时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.ss')">
            <el-date-picker v-model="formData.ss" type="date" value-format="yyyy-MM-dd" />
          </el-form-item>
        </el-col>

        <!--创建人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.createUser')">
            <el-select
              v-model="formData.createUser"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!--创建人岗位-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.createPost')">
            <el-select
              v-model="formData.createPost"
              clearable
              :placeholder="$t('select.placeholder')"
              style="width: 100%"
            >
              <el-option
                v-for="item in $store.getters['post/getSubPostList']"
                :key="item.postId"
                :label="item.postName"
                :value="item.postId"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--创建时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.createTime')">
            <el-date-picker
              v-model="formData.createTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--修改人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.modifyUser')">
            <el-select
              v-model="formData.modifyUser"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!--修改人岗位-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.modifyPost')">
            <el-select
              v-model="formData.modifyPost"
              clearable
              :placeholder="$t('select.placeholder')"
              style="width: 100%"
            >
              <el-option
                v-for="item in $store.getters['post/getSubPostList']"
                :key="item.postId"
                :label="item.postName"
                :value="item.postId"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--修改时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.modifyTime')">
            <el-date-picker
              v-model="formData.modifyTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--指派备注-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.remark')">
            <el-input v-model="formData.remark" v-blur:remark="formData" clearable />
          </el-form-item>
        </el-col>

        <!--tempModel-->
        <el-col :span="6">
          <el-form-item label="Temp Model">
            <el-input v-model="formData.tempModel" v-blur:tempModel="formData" clearable />
          </el-form-item>
        </el-col>
        <!--N-1专案-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.baseProjectId')">
            <el-input v-model="formData.baseProjectId" v-blur:tempModel="formData" clearable />
          </el-form-item>
        </el-col>
        <!--N-1机型-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.baseModel')">
            <el-input v-model="formData.baseModel" v-blur:tempModel="formData" clearable />
          </el-form-item>
        </el-col>
        <!--N-1配置-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.baseConfig')">
            <el-input v-model="formData.baseConfig" v-blur:tempModel="formData" clearable />
          </el-form-item>
        </el-col>
      </el-row>
      <!-- ----------------FD基本信息END------------------- -->

      <!-- -----------------FD负责人START------------------ -->
      <el-row>
        <el-col :span="24">
          <el-form-item
            :label="$t('FD.fdOwner')"
            label-width="160px"
            style="background: #c9d2ca; padding-left: 20px"
          />
        </el-col>
      </el-row>
      <el-row style="padding-left: 20px">
        <!--PBM负责人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pbmOwner')">
            <el-select
              v-model="formData.pbmOwner"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getPbmUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.bu + ' ' + item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!--EE负责人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.eeOwner')">
            <el-select
              v-model="formData.eeOwner"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getEEGcmUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.gcmFunction + ' ' + item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!--ME负责人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.meOwner')">
            <el-select
              v-model="formData.meOwner"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getMEGcmUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.gcmFunction + ' ' + item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <!--PKG负责人-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pkgOwner')">
            <el-select
              v-model="formData.pkgOwner"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['user/getPKGGcmUserSimpleCollects']"
                :key="item.userId"
                :label="item.userName"
                :value="item.userId"
              >
                <span style="float: left">{{ item.userName }}</span>
                <span style="float: right; color: #b4b4b4; font-size: 12px">
                  {{ item.gcmFunction + ' ' + item.team }}
                </span>
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- -----------------FD负责人END-------------------- -->

      <!-- -----------------FD审批状态及时间START------------ -->
      <el-row>
        <el-col :span="24">
          <el-form-item
            :label="$t('FD.fdApproveState')"
            label-width="160px"
            style="background: #c9d2ca; padding-left: 20px"
          />
        </el-col>
      </el-row>

      <el-row style="padding-left: 20px">
        <!--EE估价分配状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.eeAssigned')">
            <el-select
              v-model="formData.eeAssigned"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--EE分配时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.eeAssignedTime')">
            <el-date-picker
              v-model="formData.eeAssignedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--EE审批状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.eeApproved')">
            <el-select
              v-model="formData.eeApproved"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--EE审批时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.eeApprovedTime')">
            <el-date-picker
              v-model="formData.eeApprovedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--ME估价分配状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.meAssigned')">
            <el-select
              v-model="formData.meAssigned"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--ME分配时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.meAssignedTime')">
            <el-date-picker
              v-model="formData.meAssignedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--ME审批状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.meApproved')">
            <el-select
              v-model="formData.meApproved"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--ME审批时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.meApprovedTime')">
            <el-date-picker
              v-model="formData.meApprovedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--PKG估价分配状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pkgAssigned')">
            <el-select
              v-model="formData.pkgAssigned"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--PKG分配时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pkgAssignedTime')">
            <el-date-picker
              v-model="formData.pkgAssignedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--PKG审批状态-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pkgApproved')">
            <el-select
              v-model="formData.pkgApproved"
              clearable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $store.getters['dict/dictOptions']('YN')"
                :key="item.code"
                :label="item.value"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--PKG审批时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.pkgApprovedTime')">
            <el-date-picker
              v-model="formData.pkgApprovedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <!-- -----------------FD审批状态及时间END--------------- -->

      <!-- -----------------FD是否状态及时间START------------- -->
      <el-row>
        <el-col :span="24">
          <el-form-item
            :label="$t('FD.fdTrueOrFalseState')"
            label-width="160px"
            style="background: #c9d2ca; padding-left: 20px"
          />
        </el-col>
      </el-row>

      <el-row style="padding-left: 20px">
        <!--fdStatus-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.fdStatus')">
            <el-select
              v-model="formData.fdStatus"
              clearable
              filterable
              :placeholder="$t('select.placeholder')"
            >
              <el-option
                v-for="item in $fdStatus()"
                :key="item.code"
                :label="item.label"
                :value="item.code"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <!--接收时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.receivedTime')">
            <el-date-picker
              v-model="formData.receivedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--分配时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.assignedTime')">
            <el-date-picker
              v-model="formData.assignedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--驳回时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.rejectedTime')">
            <el-date-picker
              v-model="formData.rejectedTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>

        <!--完成时间-->
        <el-col :span="6">
          <el-form-item :label="$t('FdData.completeTime')">
            <el-date-picker
              v-model="formData.completeTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
        </el-col>
      </el-row>
      <!-- -----------------FD是否状态及时间END---------------- -->
    </el-form>
    <span style="display: block; text-align: center; margin-top: 25px">
      <!--取消按钮-->
      <!-- <el-button size="medium" @click="cancel">{{ $t('button.cancel') }}</el-button> -->
      <!--保存按钮-->
      <el-button :loading="isRequesting" size="medium" type="primary" @click="save">
        {{ $t('button.save') }}
      </el-button>
    </span>
  </div>
</template>

<script>
import { fdEdit } from '@/api/quote/fd'

export default {
  name: 'FdDataBaseEditTab',
  props: {
    inputData: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      // 正在查询
      isRequesting: false,
      formData: {}
    }
  },
  created() {
    this.pageDataInit()
  },
  methods: {
    pageDataInit() {
      // 将props传入的值复制给formData的值
      this.formData = JSON.parse(JSON.stringify(this.inputData))
    },
    async save() {
      try {
        await this.$confirmBox(this.$t('button.save'), 'success')
        this.isRequesting = true
        await fdEdit(this.formData, { msgSuccess: true, msgError: true })
        this.$emit('save')
      } catch (error) {
        console.log(error)
      } finally {
        this.isRequesting = false
      }
    },
    cancel() {
      this.$emit('cancel')
    }
  }
}
</script>

<style lang="scss" scoped>
/deep/ .el-form-item__content {
  .el-input {
    width: 88% !important;
  }
  .el-input-number {
    width: 88% !important;
    .el-input {
      width: 100% !important;
    }
  }
}
</style>
